草庐IT

php - svg 到按需图像

全部标签

javascript - 在 Firefox 中渲染内联 SVG

我有一个我正在开发的网站,我们允许创建形状,我们使用通过javascript构建的内联svg来创建形状。我遇到了一个奇怪的问题,svg在Chrome中正确呈现,但在Firefox中它切掉了一部分SVG。下面的代码是一个星号。在chrome中,这完美地显示出来。在Firefox中,我只能看到图像左上角的25%左右。我不确定是我们做错了什么还是Firefox有问题。有趣的是,如果我将星星变小(比如这个星星大小的1/4),它会在Firefox中完美呈现。感谢您的帮助! 最佳答案 您需要在中添加width和height属性元素。width=

javascript - 获取以屏幕像素为单位的旋转 SVG 元素的边界?

我正在尝试找到以屏幕像素为单位获取任意SVG元素边界框的最佳方法,以便正确覆盖HTML元素。到目前为止,我的方法是使用.getBBox()和.getCTM()检索对象的边界框和变换矩阵,然后将变换应用于边界框点如thisquestion的已接受答案中所述.//gettheelementvarel=$(selector)[0],pt=$(selector).closest('svg')[0].createSVGPoint();//gettheboundingboxandmatrixvarbbox=el.getBBox(),matrix=el.getScreenCTM();pt.x=bbo

javascript - d3.js 处理非 svg 浏览器

按照目前的情况,这个问题不适合我们的问答形式。我们希望答案得到事实、引用或专业知识的支持,但这个问题可能会引发辩论、争论、投票或扩展讨论。如果您觉得这个问题可以改进并可能重新打开,visitthehelpcenter指导。关闭9年前。d3.js开发人员如何处理无法呈现svg的浏览器?我很好奇,因为InternetExplorer9、8、7等在世界大部分关键地区拥有巨大的多数市场份额,但似乎有如此活跃的d3.js社区,就好像InternetExplorer不存在一样。D3的目的是提供灵活的数据驱动图表,因此能够以直观的方式可视化复杂的主题。因此,瞄准最时尚的技术场景并假装其他人也从他们的

javascript - Phonegap 编码图像 base64

我正在尝试将图像编码为base64并将其发送到服务器。当我检索图像时,它显示的所有内容都是空白的。我用来编码的代码是这样的:encodeImageUri=function(imageUri){varc=document.createElement('canvas');varctx=c.getContext("2d");varimg=newImage();img.onload=function(){c.width=this.width;c.height=this.height;ctx.drawImage(img,0,0);};img.src=imageUri;vardataURL=c.t

javascript - 使 td 的背景图像适合非静态图像的 100%

我有td标签:和CSS:.np-logo{background-repeat:no-repeat;background-size:100%;}我正在根据公司Logo更改图像。所有图像的大小和宽度都不同。.np-logo{background-image:url('"+companylogo+"');问题是图像没有正确地适应td。我希望它们占据整个td。但是对于每个公司来说,背景图像的位置都不统一。我什至尝试在图像加载时使用java脚本以适应容器。虽然没有用。任何帮助家伙......? 最佳答案 尝试background-size:1

javascript - 测试是否加载了所有图像

这是我尝试测试是否所有图像都已加载的能力:for(vari=0;i问题是一旦循环完成,变量i就是imgCount。这意味着所有其他“已加载”标志在加载图像时永远不会设置为true。是否有某种方法可以将“已加载”属性添加到图像,或者是否有一些解决此问题的方法? 最佳答案 您需要使用闭包定义onload函数:for(vari=0;i这是一个jsFiddle这证明了这种在类似场景中的工作。另外,请注意,您当前选择作为答案的解决方案实际上不起作用:imgArr[i].onload=(function(){loadArr[i]=true;})

javascript - 如何在 JavaScript 中使用 Phonegap 进行图像处理

我想知道如何像使用Phonegap库在JavaScript中的C#代码中那样操作像素。我不确定是否可行。到目前为止,我在Phonegap库中发现与图像处理无关。(它确实提供了Image,Capturehelper来做一些事情,但这还不够。)当我说操纵像素时,它与裁剪、调整大小、旋转等简单方法无关。它应该下降到访问图像中单个像素的级别,以便可以进行更复杂的计算。谢谢。附言:感谢各位留下“-1”,请同时给出你们的理由。谢谢 最佳答案 因为是javascript,所以与在浏览器上做的一样:使用这里是fastCanvas,一个使用它的pho

javascript - 重叠 SVG 元素上的鼠标事件

如何处理重叠svg元素上的点击事件?我正在使用Reaphael.js库。问题是topDOM元素正在拦截鼠标事件,即使底部元素没有被任何绘图重叠。我的问题是如何使我的示例中的两个圆圈都可点击并仍然将它们保留在两个svg元素中?这是我的代码:CSS:#container{position:relative;width:200px;height:200px}#container>svg{position:absolute!important;top:0;left:0;}JavaScript:vartopLayer=Raphael('container',200,200);varbottomL

javascript - 在图像点击上运行 Javascript

我的网站上有以下图形按钮:Clickheretoaddtocartnow我想在单击(当前值#)时运行特定的javascript脚本以运行一些javascript-javascript代码本质上会生成一个弹出式iFrame,其中包含其他内容。实现此目标的最佳方法是什么? 最佳答案 试试这个window.onload=function(){document.getElementById("btn_text").onclick=function(){//Doyourstuffhere};};或者如果你可以使用JQuery$(documen

javascript - 在 JavaScript 中动态创建 SVG 链接

我正在从JavaScript动态创建SVG元素。它适用于像矩形这样的可视对象,但我在生成有效的xlink时遇到了问题。在下面的示例中,第一个矩形(静态定义的)在点击时可以正常工作,但其他两个(用JavaScript创建)忽略点击......即使在Chrome中检查元素似乎显示相同的结构。我见过很多类似的问题,但没有一个能准确解决这个问题。我找到的最接近的是[addingimagenamespaceinsvgthroughJSstilldoesn'tshowmethepicture]但这不起作用(如下所述)。我的目标是完全在JavaScript中完成此操作,而不依赖于JQuery或其他库